import * as echarts from 'echarts'
import { ref, onMounted, onUnmounted } from 'vue'
export function CostincomeECharts(targetId, theme = 'back') {
  const chartInstance = ref(null)

  onMounted(async () => {
    const chart = echarts.init(document.getElementById(targetId), theme)

    initChart(chart)
    chart.resize()
    chartInstance.value = chart
  })
  onUnmounted(() => {
    if (chartInstance.value) {
      chartInstance.value.dispose()
    }
  })

  return { chartInstance }
}
function initChart(chart) {
  chart.setOption({
    title: {
      text: '成本条形图'
    },
    xAxis: {
      type: 'category',
      data: ['A', 'B', 'C', 'D', 'E']
    },
    yAxis: {
      type: 'value'
    },
    series: [
      {
        data: [5, 20, 36, 10, 10],
        type: 'bar'
      }
    ]
  })
}
